.flexStart {
  display: flex;
  justify-content: flex-start;
}

.flexCenter {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flexEnd {
  display: flex;
  justify-content: flex-end;
}

.flexAround {
  display: flex;
  justify-content: space-around;
}

.flexBetween {
  display: flex;
  justify-content: space-between;
}

.flexStartCenter {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.flexEndCenter {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.flexBetweenCenter {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.contentDiv {
  background: #fff;
}

.line {
  height: 0px;
  border-bottom: 1px solid #E4E6EA;
}

html {
  font-size: 10px !important;
}

.mb-8 {
  margin-bottom: 20px;
}

.mb-15 {
  margin-bottom: 15px;
}

.mb-20 {
  margin-bottom: 20px;
}

.pd-20 {
  margin-bottom: 20px;
}

@for $i from 1 through 100 {
  .pl-#{$i} {
    padding-left: $i + px;
  }

  .pr-#{$i} {
    padding-right: $i + px;
  }

  .pt-#{$i} {
    padding-top: $i + px;
  }

  .pb-#{$i} {
    padding-bottom: $i + px;
  }

  .p-#{$i} {
    padding: $i + px;
  }

  .p-x-#{$i} {
    padding: auto $i + px;
  }

  .p-y-#{$i} {
    padding: $i + px auto;
  }

  .ml-#{$i} {
    margin-left: $i + px;
  }

  .mr-#{$i} {
    margin-right: $i + px;
  }

  .mt-#{$i} {
    margin-top: $i + px;
  }

  .mb-#{$i} {
    margin-bottom: $i + px;
  }

  .m-#{$i} {
    margin: $i + px;
  }

  .m-x-#{$i} {
    margin: auto $i + px;
  }

  .m-y-#{$i} {
    margin: $i + px auto;
  }

  .fs-#{$i} {
    font-size: $i + px;
  }

}
/* 默认dark主题 */
:root[theme='dark'] {
  --bg-color: #0d1117;
  --text-color: #f0f6fc;
}
 
 
 
/* light主题 */
:root[theme='light'] {
  --bg-color: #ecf0f3;
  --text-color: #181818;
}